<!-- 选择地址 -->

<template>
	<benben-popup v-model="show" :mask="true" :mask-close-able="true" mode='bottom' :z-index='999'>
		<view class="flex benben-flex-layout flex-wrap align-center">
			<view class='flex flex-direction flex-wrap align-stretch merchanDisedetails_fd1_0'>
				<view class='flex flex-wrap align-center justify-between merchanDisedetails_fd1_0_c0'>
					<view class='flex flex-wrap align-center merchanDisedetails_fd1_0_c0_c0'>
					</view>
					<view class='flex flex-wrap align-center'>
						<image class='merchanDisedetails_fd1_0_c0_c1_c0' mode="aspectFit" :src='STATIC_URL+"714.png"'>
						</image>
						<text class='merchanDisedetails_fd1_0_c0_c1_c1'>配送至</text>
						<image class='merchanDisedetails_fd1_0_c0_c1_c0' mode="aspectFit" :src='STATIC_URL+"715.png"'>
						</image>
					</view>
					<view class='flex flex-wrap align-center' @tap.stop="show=false">
						<image class='merchanDisedetails_fd1_0_c0_c2_c0' mode="aspectFit" :src='STATIC_URL+"713.png"'>
						</image>
					</view>
				</view>
				<view class='flex flex-direction flex-wrap align-stretch merchanDisedetails_fd1_0_c1'>
					<view v-for="item in addrList" :key="item.address_id"
						class='flex flex-wrap align-center merchanDisedetails_fd1_0_c1_c0' @click="selectFn(item)">
						<image v-if="item.address_id == cAddrId" class='merchanDisedetails_fd1_0_c1_c0_c0'
							mode="aspectFit" :src='STATIC_URL+"716.png"'></image>
						<image v-else class='merchanDisedetails_fd1_0_c1_c0_c0' mode="aspectFit"
							:src='STATIC_URL+"718.png"'></image>
						<text
							class='merchanDisedetails_fd1_0_c1_c0_c1'>{{item.province||""}}{{item.city||""}}{{item.district||""}}{{item.address||""}}</text>
					</view>

					<view class="add_addr_btn" @tap.stop="toAdd" data-type="navigateTo"
						data-url="/pages/yhq/editAddress/editAddress">新增地址</view>
				</view>
			</view>
		</view>
	</benben-popup>
</template>

<script>
	export default {
		props: {
			value: Boolean,
			cAddrId: [String, Number]
		},
		computed: {
			show: {
				get() {
					return this.value
				},
				set(val) {
					this.$emit("input", val)
				}
			}
		},
		data() {
			return {
				addrList: []
			}
		},
		created() {
			this.getAddrList();
		},
		methods: {
			toAdd() {
				this.show = false;
				uni.navigateTo({
					url: "/pages/yhq/editAddress/editAddress"
				})
			},
			async getAddrList() {
				try {
					const res = await this.$post('6544d0c0718a8');
					this.addrList = res.data || [];
				} catch (e) {}
			},
			async selectFn(item = {}) {
				if (this.cAddrId == item.address_id) return;
				try {
					await this.$post('6544d238b0ae5', {
						address_id: item.address_id
					});
				} catch (e) {}
				this.show = false;
				this.$emit("confirm", item);
			},
		},
	}
</script>

<style lang="scss" scoped>
	@import "./merchanDisedetails.scss";

	.add_addr_btn {
		width: 686rpx;
		height: 80rpx;
		background: #AD3823;
		border-radius: 44rpx;
		margin: 0 auto calc(32rpx + env(safe-area-inset-bottom));
		font-size: 32rpx;
		font-family: Alimama DongFangDaKai-Regular, Alimama DongFangDaKai;
		font-weight: 400;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>